<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        #table1{
            border:1px solid #2aabd2;
            width: 50%;
            background-color: lightcyan;
        }
        #table3{
            border:1px solid #2aabd2;
            width: 50%;
            background-color: lightcyan;
        }
        #table2{
            width: 100%;
        }
        #table2 tr:nth-child(odd){
            background-color: #eee;
        }
        #table2 tr:hover{
            background-color: #ccc;
        }
        #table2 tr td:first-child{
            color: #f40;
        }

        #table2 tr td{
            text-align: right;
            padding-right: 20px;
        }
        #pwdStrength{
            width: 80%;
            list-style: none;
            height: 30px;
            display: flex;
            flex: 1;
        }
        #weak,
        #middle,
        #strong{
            height: 20px;
            width: 35px;
            border: 1px solid black;
            background: rgb(238, 238, 238);
        }
        #middle{
            border-left: 0;
            border-right: 0;
        }

    </style>
</head>

<body>
<form action="xitong_selectPerm.do">
    <table id="table1" border="1">
        <tr>
            <td colspan="5">权限ID</td>
            <td><input type="text" id="permID" name="permID" th:value="${session.permID}"></td>
        </tr>
        <tr>
            <td colspan="5">权限名称</td>
            <td><input type="text" id="permName" name="permName" th:value="${session.permName}"></td>
        </tr>
        <tr>
            <td colspan="5"><input type="submit" value="查询"></td>
            <td></td>
        </tr>
    </table>
    每页显示条数<select name="pageRows" id="pageRows" onchange="lastpage1(this.value)">
    <option th:each="i:${session.list}" th:text="${i}" th:value="${i}" th:selected="${session.pageRows == i}"></option>
</select>
    第<label th:text="${session.pageInfo.getPageNum()}"></label>页
    <input type="hidden" th:value="${session.pageInfo.getPageNum()}" id="pageNum">

</form>
<label th:if="${session.pageInfo.size==0}" style="color: #ff4400">没有查到任何数据!请核对查询信息</label>
<table id="table2" th:if="${session.pageInfo.size!=0}">
    <tr><td>权限ID</td><td>权限名称</td><td>编辑时间</td><td>是否删除</td><td>操作</td></tr>
    <tr th:each="everyPerm:${session.pageInfo.getList()}"><td th:text="${everyPerm.permId}"></td><td th:text="${everyPerm.permName}"></td><td th:text="${everyPerm.permEditTime}"></td><td th:text="${everyPerm.permIsDel eq 1?'是':'否'}"></td><td><button th:value="${everyPerm.permId}" onclick="shanchu(this.value)">删除</button></td></tr>
    <tr><button th:value="${session.pageInfo.getPageNum()>1?session.pageInfo.getPageNum()-1:session.pageInfo.getPageNum()}" onclick="lastpage(this.value)">上一页</button>
        <button th:value="${session.pageInfo.getPageNum()<session.pageInfo.pages?session.pageInfo.getPageNum()+1:session.pageInfo.getPageNum()}" onclick="lastpage(this.value)">下一页</button></tr>
</table>
</body>
<script>
    function lastpage(page) {
        var permName = $("#permName").val();
        var permID = $("#permID").val();
        var pagerows = $("#pageRows").val();
        window.location = "xitong_selectGroup.do?pageNum="+page+"&pageRows="+pagerows+"&permName="+permName+"&permID="+permID;
    }
    function lastpage1(row) {
        var permName = $("#permName").val();
        var permID = $("#permID").val();
        var pageNum = $("#pageNum").val();
        window.location = "xitong_selectGroup.do?pageNum="+pageNum+"&pageRows="+row+"&permName="+permName+"&permID="+permID;
    }
    function shanchu(permId) {

        window.location = "deletePerm.do?permId="+permId;
    }
</script>
</html>